<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<div id="app">
			<!-- //数字自增 -->
			<button type="button" @click.once="increate">自增</button>
			<button type="button" @click="say('hello')">传参数</button>
			<a v-bind:href="href" @click="jump" v-bind:style="obj_style">qzimp</a>
			 <a href="http://www.luffycity.com" @click.prevent="show()">路飞学城</a>
			 <button type="button" @keyup.enter="press('keydow')">按键修饰符</button>
			<!-- //插值 data ,计算属性,props组件属性 -->
			<p>{{count}}</p>
		    <!-- <p>{{count++}}</p> -->
		</div>
		<script src="./node_modules/vue/dist/vue.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			let app =new Vue({
				el:'#app',
				data:{
					count:0,
					href:'https://www.qzimp.cn',
					obj_style:{
						background:'red',
						
					},
					
				},
				
				//事件方法
				methods:{
					// increate:function(){
						
					// },
					increate(){
						this.count++;
					},
					say(str){
						console.log(str+":树先生");
					},
					jump(e){
						console.log("jump");
						
					},show(){
						console.log("show");
					},
					press(){
						console.log("press");
					}
				},
				computed:{
					
				}
				
			})
		</script>
	</body>
</html>
